<template>
  <el-dialog
    :title="!dataForm.urId ? '新增' : '修改'"
    :close-on-click-modal="false"
    :visible.sync="visible"
  >
    <el-form
      :model="dataForm"
      :rules="dataRule"
      ref="dataForm"
      label-width="80px"
    >
      <el-form-item label="昵称" prop="urName">
        <el-input v-model="dataForm.urName" placeholder="昵称"></el-input>
      </el-form-item>
      <el-form-item label="用户名" prop="urUsername">
        <el-input v-model="dataForm.urUsername" placeholder="用户名"></el-input>
      </el-form-item>
           <el-form-item label="设置密码" prop="urPassword" v-if="!dataForm.urId">
        <el-input v-model="dataForm.urPassword" placeholder="密码"></el-input>
      </el-form-item>
      <el-form-item label="邮箱" prop="urEmail">
        <el-input v-model="dataForm.urEmail" placeholder="邮箱"></el-input>
      </el-form-item>
      <el-form-item label="注册时间" prop="createTime" v-if="dataForm.urId">
        <el-input
          v-model="dataForm.createTime"
          placeholder="账号的注册时间"
          disabled
        ></el-input>
      </el-form-item>
      <el-form-item label="头像" prop="urAvatar">
        <singleUpload v-model="dataForm.urAvatar" />
      </el-form-item>
      <el-form-item label="状态" prop="urStuats">
        <!--   <el-input v-model="dataForm.urStuats" placeholder="状态(0.冻结，1.正常 )"></el-input> -->
        <el-select v-model="dataForm.urStuats" placeholder="选择状态">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="角色" prop="urReId">
      <!--   <el-input v-model="dataForm.urReId" placeholder="角色id"></el-input> -->
             <el-select v-model="dataForm.urReId" placeholder="选择角色">
          <el-option
            v-for="item in roles"
            :key="item.reId"
            :label="item.reName"
            :value="item.reId"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="性别" prop="urSex">
        <!--   <el-input v-model="dataForm.urSex" placeholder="性别"></el-input> -->
        <el-select v-model="dataForm.urSex" placeholder="选择性别">
          <el-option :key="0" label="男" :value="0"> </el-option>
          <el-option :key="1" label="女" :value="1"> </el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import admin from "@/api/admin";
import singleUpload from "@/components/upload/singleUpload";
import role from '@/api/role'
export default {
  components: { singleUpload },
  data() {
    return {
      roles:[],
      options: [
        {
          value: "0",
          label: "冻结",
        },
        {
          value: "1",
          label: "正常",
        },
      ],
      visible: false,
      dataForm: {
        urId: 0,
        urName: "",
        urUsername: "",
        urPassword: "",
        urEmail: "",
        createTime: "",
        urAvatar: "",
        urStuats: "",
        urReId: "",
        urSex: "",
      },
      dataRule: {
        urName: [{ required: true, message: "昵称不能为空", trigger: "blur" }],
        urUsername: [
          { required: true, message: "用户名不能为空", trigger: "blur" },
        ],
        urPassword: [
          { required: true, message: "密码不能为空", trigger: "blur" },
        ],
        urEmail: [{ required: true, message: "邮箱不能为空", trigger: "blur" }],
        createTime: [
          {
            required: true,
            message: "账号的注册时间不能为空",
            trigger: "blur",
          },
        ],
        urAvatar: [
          { required: true, message: "头像不能为空", trigger: "blur" },
        ],
        urStuats: [
          {
            required: true,
            message: "状态(0.冻结，1.正常 )不能为空",
            trigger: "blur",
          },
        ],
        urReId: [
          { required: true, message: "角色id不能为空", trigger: "blur" },
        ],
        urSex: [{ required: true, message: "性别不能为空", trigger: "blur" }],
      },
    };
  },

  methods: {
      /**
       *  角色获取
       */
      getRoles(){
          role.findAll().then(({data})=>{
             this.roles=data.data
          })
      },
     
    init(id) {
    this.getRoles()
      this.dataForm.urId = id || 0;
      this.visible = true;
      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        if (this.dataForm.urId) {
          admin.info(this.dataForm.urId).then(({ data }) => {
            if (data) {
              this.dataForm.urName = data.user.urName;
              this.dataForm.urUsername = data.user.urUsername;
              this.dataForm.urPassword = data.user.urPassword;
              this.dataForm.urEmail = data.user.urEmail;
              this.dataForm.createTime = data.user.createTime;
              this.dataForm.urAvatar = data.user.urAvatar;
              this.dataForm.urStuats = data.user.urStuats;
              this.dataForm.urReId = data.user.urReId;
              this.dataForm.urSex = data.user.urSex;
            }
          });
        }
      });
    },
    // 表单提交
    dataFormSubmit() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
        var Date={  urId: this.dataForm.urId || undefined,
              urName: this.dataForm.urName,
              urUsername: this.dataForm.urUsername,
              urPassword: this.dataForm.urPassword,
              urEmail: this.dataForm.urEmail,
              createTime: this.dataForm.createTime,
              urAvatar: this.dataForm.urAvatar,
              urStuats: this.dataForm.urStuats,
              urReId: this.dataForm.urReId,
              urSex: this.dataForm.urSex}
         admin.updateAdd(Date).then((res) => {
            if (res) {
              this.$message({
                message: "操作成功",
                type: "success",
                duration: 1500,
                onClose: () => {
                  this.visible = false;
                  this.$emit("refreshDataList");
                },
              });
            } else {
              this.$message.error(data.msg);
            }
          });
        }
      });
    },
  },
};
</script>
